<template>
<div class="home">
  <han-pi></han-pi>
  <roll-go v-bind:list="roll"></roll-go>
  <men-uu :list="menu"></men-uu>
  <uu-zi></uu-zi>
  <ho-tting :list="hotting"></ho-tting>
  <da-ti :list="dation"></da-ti>
  <bo-ki :list="bots"></bo-ki>
</div>
</template>

<script>
// @ is an alias to /src

import HanPi from './header/Herder.vue'
import RollGo from './header/Roll.vue'
import MenUu from './header/menu.vue'
import UuZi from './header/Ulli.vue'
import HoTting from './header/hotting.vue'
import DaTi from './header/dation.vue'
import BoKi from './header/bottom.vue'
import axios from 'axios'

export default {
  name: 'home',
  components: {
    HanPi,
    RollGo,
    MenUu,
    UuZi,
    HoTting,
    DaTi,
    BoKi
  },
  data () {
    return {
      roll: [],
      menu: [],
      hotting: [],
      dation: [],
      bots: []
    }
  },
  mounted () {
    axios.get('/json/DSJ.json')
      .then((response) => { // responsts 返回的所有数据
        let dataObj = response.data
        let dataArr = dataObj.data
        if (dataObj.ret && dataArr) {
          this.roll = dataArr.roll
          this.menu = dataArr.menu
          this.hotting = dataArr.hotting
          this.dation = dataArr.dation
          this.bots = dataArr.bots
        }
      })
  }
}
</script>
